<template>
    <div style="width:100%;height: 100%">
        <div style="width:25%;height: 25%;float: left ;padding-top: 10%;padding-left: 10%">

            <p class="colorBlue" style="font-size: .2rem;">{{numberConfig.title}} </p>
            <div >
                <dv-digital-flop :config="numberConfig" style="width:1.25rem;height: .6rem;" />
            </div>
        </div>

        <div style="width:25% ;height: 25%;float: left;padding-top: 10%;padding-left: 10%">
            <p class="colorBlue" style="font-size: .2rem;">{{numberConfig.title}} </p>
            <div>
                <dv-digital-flop :config="numberConfig" style="width:1.25rem;height: .6rem;" />
            </div>
        </div>

        <div style="width:25%;height: 25%;float: left;padding-top: 10%;padding-left: 10%">
            <p class="colorBlue" style="font-size: .2rem;">{{numberConfig.title}} </p>
            <div>
                <dv-digital-flop :config="numberConfig" style="width:1.25rem;height: .6rem;" />
            </div>
        </div>
        <div style="width:25%;height: 25%;float: left;padding-top: 10%;padding-left: 10%">
            <p class="colorBlue" style="font-size: .2rem;">{{numberConfig.title}} </p>
            <div>
                <dv-digital-flop :config="numberConfig" style="width:1.25rem;height: .6rem;" />
            </div>
        </div>
        <div style="width:25%;height: 25%;float: left;padding-top: 10%;padding-left: 10%">
            <p class="colorBlue" style="font-size: .2rem;">{{numberConfig.title}} </p>
            <div>
                <dv-digital-flop :config="numberConfig" style="width:1.25rem;height: .6rem;" />
            </div>
        </div>
        <div style="width:25%;height: 25%;float: left;padding-top: 10%;padding-left: 10%">
            <p class="colorBlue" style="font-size: .2rem;">{{numberConfig.title}} </p>
            <div>
                <dv-digital-flop :config="numberConfig" style="width:1.25rem;height: .6rem;" />
            </div>
        </div>
        <div style="width:25%;height: 25%;float: left;padding-top: 10%;padding-left: 10%">
            <p class="colorBlue" style="font-size: .2rem;">{{numberConfig.title}} </p>
            <div>
                <dv-digital-flop :config="numberConfig" style="width:1.25rem;height: .6rem;" />
            </div>
        </div>
        <div style="width:25%;height: 25%;float: left;padding-top: 10%;padding-left: 10%">
            <p class="colorBlue" style="font-size: .2rem;">{{numberConfig.title}} </p>
            <div>
                <dv-digital-flop :config="numberConfig" style="width:1.25rem;height: .6rem;" />
            </div>
        </div>
    </div>

</template>

<script>
    export default {
        name: "topNumber",
        props:{
            numberConfig: {
                type:Object,
                default:()=>{
                    return{
                        title:'在线用户数',
                        name:'在线用户数',
                        number:[100],
                        content: '{nt}个',
                        style:{fontSize: 20}
                    }
                }
            }
        },
    }
</script>

<style scoped>

</style>

